<div class="editor-row">
	<div class="section">
		<h5>Left Y Axis</h5>

		<div class="editor-option">
			<label class="small">Format
				<tip>Y-axis formatting</tip>
			</label>
			<select class="input-small" ng-model="panel.y_formats[0]"
					ng-options="f for f in ['none','short','bytes', 'bits', 'bps', 's', 'ms', 'µs', 'ns', 'percent']"
					ng-change="render()"></select>
		</div>
		<div class="editor-option">
			<label class="small">Min / <a
					ng-click="toggleGridMinMax('leftMin')">Auto <i
					class="icon-star"
					ng-show="_.isNull(panel.grid.leftMin)"></i></a></label>
			<input type="number" class="input-small"
				   ng-model="panel.grid.leftMin" ng-change="render()"
				   ng-model-onblur/>
		</div>
		<div class="editor-option">
			<label class="small">Max / <a
					ng-click="toggleGridMinMax('leftMax')">Auto <i
					class="icon-star"
					ng-show="_.isNull(panel.grid.leftMax)"></i></a></label>
			<input type="number" class="input-small"
				   ng-model="panel.grid.leftMax" ng-change="render()"
				   ng-model-onblur/>
		</div>
		<div class="editor-option">
			<label class="small">Label</label>
			<input ng-change="get_data()" ng-model-onblur placeholder=""
				   type="text" class="input-medium"
				   ng-model="panel.leftYAxisLabel">
		</div>
	</div>
	<div class="section">
		<h5>Right Y Axis</h5>

		<div class="editor-option">
			<label class="small">Format
				<tip>Y-axis formatting</tip>
			</label>
			<select class="input-small" ng-model="panel.y_formats[1]"
					ng-options="f for f in ['none','short','bytes', 'bits', 'bps', 's', 'ms', 'µs', 'ns', 'percent']"
					ng-change="render()"></select>
		</div>
		<div class="editor-option">
			<label class="small">Min / <a
					ng-click="toggleGridMinMax('rightMin')">Auto <i
					class="icon-star"
					ng-show="_.isNull(panel.grid.rightMin)"></i></a></label>
			<input type="number" class="input-small"
				   ng-model="panel.grid.rightMin" ng-change="render()"
				   ng-model-onblur/>
		</div>
		<div class="editor-option">
			<label class="small">Max / <a
					ng-click="toggleGridMinMax('rightMax')">Auto <i
					class="icon-star"
					ng-show="_.isNull(panel.grid.rightMax)"></i></a></label>
			<input type="number" class="input-small"
				   ng-model="panel.grid.rightMax" ng-change="render()"
				   ng-model-onblur/>
		</div>
	</div>
</div>


<div class="editor-row">
	<div class="section">
		<h5>Legend styles</h5>
		<editor-opt-bool text="Show" model="panel.legend.show"
						 change="get_data();"></editor-opt-bool>
		<editor-opt-bool text="Values" model="panel.legend.values"
						 change="render()"></editor-opt-bool>
		<editor-opt-bool text="Table" model="panel.legend.alignAsTable"
						 change="render()"></editor-opt-bool>
		<editor-opt-bool text="Right side" model="panel.legend.rightSide"
						 change="render()"></editor-opt-bool>
		<editor-opt-bool text="Hide empty" model="panel.legend.hideEmpty"
						 tip="Hides series with only null values"
						 change="render()"></editor-opt-bool>
	</div>

	<div class="section" ng-if="panel.legend.values">
		<h5>Legend values</h5>
		<editor-opt-bool text="Min" model="panel.legend.min"
						 change="render()"></editor-opt-bool>
		<editor-opt-bool text="Max" model="panel.legend.max"
						 change="render()"></editor-opt-bool>
		<editor-opt-bool text="Current" model="panel.legend.current"
						 change="render()"></editor-opt-bool>
		<editor-opt-bool text="Total" model="panel.legend.total"
						 change="render()"></editor-opt-bool>
		<editor-opt-bool text="Avg" model="panel.legend.avg"
						 change="render()"></editor-opt-bool>
	</div>

	<div class="section">
		<h5>Grid thresholds</h5>

		<div class="editor-option">
			<label class="small">Level1</label>
			<input type="number" class="input-small"
				   ng-model="panel.grid.threshold1" ng-change="render()"
				   ng-model-onblur/>
		</div>
		<div class="editor-option">
			<label class="small">Color</label>
			<spectrum-picker ng-model="panel.grid.threshold1Color"
							 ng-change="render()"></spectrum-picker>
		</div>
		<div class="editor-option">
			<label class="small">Level2</label>
			<input type="number" class="input-small"
				   ng-model="panel.grid.threshold2" ng-change="render()"
				   ng-model-onblur/>
		</div>
		<div class="editor-option">
			<label class="small">Color</label>
			<spectrum-picker ng-model="panel.grid.threshold2Color"
							 ng-change="render()"></spectrum-picker>
		</div>
		<editor-opt-bool text="Line mode" model="panel.grid.thresholdLine"
						 change="render()"></editor-opt-bool>
	</div>

	<div class="section">
		<h5>Show Axes</h5>
		<editor-opt-bool text="X-Axis" model="panel['x-axis']"
						 change="render()"></editor-opt-bool>
		<editor-opt-bool text="Y-axis" model="panel['y-axis']"
						 change="render()"></editor-opt-bool>
	</div>

</div>
